<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>物料管理</title>
    <link rel="stylesheet" href="/layui/layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/layui/layuiadmin/style/admin.css" media="all">
    <link rel="stylesheet" href="/js/css/clearcss.css" media="all">
    <style>
        .layui-card-header{
            height: 68px;
            line-height: 58px;
        }
        .layui-inline .layui-form-label2{
            padding-left: 20px;
            padding-top: 10px;
            padding-bottom: 10px;
            width: 80px;
            font-weight: 400;
            line-height: 20px;
            text-align: right;
        }
        #addSuppliesModel{
            padding:30px;
            display: none;
        }

        #editSuppliesModel {
            padding: 30px;
            display: none;
        }
        .danger{
            color:#FF5722;
            padding-right: 5px;
        }
    </style>
</head>
<body>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header layui-form">
                    <div class="layui-inline">
                        <label class="layui-form-label2" style="width:auto">物料名称：</label>
                        <div class="layui-input-inline">
                            <input type="text" name="toolName" id="toolName" placeholder="请输入名称" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label2">物料编号：</label>
                        <div class="layui-input-inline">
                            <input type="text" name="model" id="model" class="layui-input"  style="width: 199px" placeholder="请输入规格型号"/>
                        </div>
                    </div>
                    <div class="layui-inline" style="float: right;">
                        <button class="layui-btn layui-btn-primary layui-btn-sm" lay-active="reload">清空</button>
                        <button class="layui-btn layui-btn-sm" lay-event="AllData" data-type="AllData" lay-active="AllData">搜索</button>
                    </div>
                </div>
                <div class="layui-card-body">
                    <table id="suppliesList" lay-filter="suppliesList" lay-data="{id:'suppliesList'}"></table>
                </div>
                <div type="text/html" id="role_list" style="display:none">
                    <a class="layui-btn layui-btn-sm" lay-event="add">添加</a>
                    <a class="layui-btn layui-btn-sm" lay-event="outExcel">导出</a>
                </div>
                <script type="text/html" id="test-table-operate-barDemo">
                    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
                    <a class="layui-btn layui-btn-xs" lay-event="del">删除</a>
                </script>

            </div>
        </div>
    </div>
</div>
<div id="addSuppliesModel">
    <form class="layui-form layui-form-pane" action="" lay-filter="formTest1">
        <div class="layui-form-item">
            <label class="layui-form-label"><span class="danger">*</span>物料编号</label>
            <div class="layui-input-block">
                <input type="text" name="add_productCode" id="add_productCode" lay-verify="required" placeholder="请输入物料编号" autocomplete="off" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label"><span class="danger">*</span>物料名称</label>
            <div class="layui-input-block">
                <input type="text" name="add_productName" id="add_productName"  placeholder="请输入物料名称" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"><span class="danger">*</span>容器类型</label>
            <div class="layui-input-block">
                <select name="add_dept" id="add_dept" lay-filter="add_dept" lay-search lay-verify="required">
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"><span class="danger">*</span>预警量</label>
            <div class="layui-input-block">
                <input type="text" name="add_expectNum" id="add_expectNum" placeholder="请输入预警量" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"><span class="danger">*</span>满箱数量</label>
            <div class="layui-input-block">
                <input type="text" name="add_overfillNum" id="add_overfillNum" placeholder="请输入满箱数量" autocomplete="off" class="layui-input">
            </div>
        </div>
    </form>
</div>
<div id="editSuppliesModel">
    <form class="layui-form layui-form-pane" action="" lay-filter="formTest1">
        <div class="layui-form-item">
            <label class="layui-form-label"><span class="danger">*</span>物料编号</label>
            <div class="layui-input-block">
                <input type="text" name="edit_productCode" id="edit_productCode" lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input" readonly>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label"><span class="danger">*</span>物料名称</label>
            <div class="layui-input-block">
                <input type="text" name="edit_productName" id="edit_productName"  placeholder="请输入物料名称" autocomplete="off" class="layui-input">
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"><span class="danger">*</span>容器类型</label>
            <div class="layui-input-block">
                <select name="add_dept" id="edit_dept" lay-filter="add_dept" lay-search lay-verify="required">
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"><span class="danger">*</span>预警量</label>
            <div class="layui-input-block">
                <input type="text" name="edit_expectNum" id="edit_expectNum" placeholder="请输入预警量" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"><span class="danger">*</span>满箱数量</label>
            <div class="layui-input-block">
                <input type="text" name="edit_overfillNum" id="edit_overfillNum" placeholder="请输入满箱数量" autocomplete="off" class="layui-input">
            </div>
        </div>
    </form>
</div>
<script src="/layui/layuiadmin/layui/layui.js"></script>
<!--<script type="text/javascript" src="/js/jquery-1.8.0.js"></script>-->
<script type="text/javascript" src="/js/jquery-3.7.1.min.js"></script>

<script>
    addId=0;
    layui.use(['table','layer','util','form'], function(){
        let table = layui.table;
        let layer=layui.layer;
        let util=layui.util;
        let form=layui.form;
        table.render({
            elem: '#suppliesList'
            ,url: '/storage/getGoodsList' //数据接口
            ,page: true //开启分页
            ,limit:15
            ,limits:[15,20,50,100,2000]
            ,toolbar:'#role_list'
            ,loading:true
            ,height: 'full-168'
            ,cols: [
                [ //表头
                    {field:'No', width:80, title: '序号', type:'numbers', fixed: 'left'}
                    ,{field: 'id', title: 'ID',  sort: true, fixed: 'left', hide: 'hide'}
                    ,{field: 'productName', title: '物料名称',  sort: true, fixed: 'left'}
                    ,{field: 'productCode', title: '物料编码',  sort: true, fixed: 'left'}
                    ,{field: 'inventoryNum', title: '库存数量',  sort: true, fixed: 'left'}
                    ,{field: 'num', title: '使用容器',  sort: true, fixed: 'left'}
                    ,{field: 'overfillNum', title: '满箱数量',  sort: true, fixed: 'left'}
                    ,{field: 'expectNum', title: '预警量',  sort: true, fixed: 'left'}
                    ,{field: 'operate',align:'center',title:'操作', fixed: 'right', toolbar: '#test-table-operate-barDemo',width:200}
                ]
            ]
        });
        table.on('toolbar(suppliesList)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            switch(obj.event){
                case "add":
                    layer.open({
                        type: 1,
                        title:'添加物料',
                        area: ['600px', '610px'], //自定义文本域宽高
                        content: $('#addSuppliesModel'), //这里content是一个普通的String
                        btn: ['提交', '取消'],//这里content是一个普通的String
                        btnAlign: 'c',
                        cancel: function(index, layero){
                            fromClear();
                        },
                        success: function(layero, index){
                            // 添加form标识
                            layero.addClass('layui-form');
                            // 将保存按钮改变成提交按钮
                            layero.find('.layui-layer-btn0').attr({
                                'lay-filter': 'testttt',
                                'lay-submit': ''
                            });
                            form.render();
                        },
                        yes:function(index,layero){
                            form.on('submit(testttt)',function(data){
                                let add_productCode=$("#add_productCode").val()//用户名
                                let add_productName=$("#add_productName").val()//卡号
                                let add_expectNum=$("#add_expectNum").val()//角色
                                let add_overfillNum=$("#add_overfillNum").val()//权限
                                if(add_productCode==null || add_productName==null || add_overfillNum==null){
                                    layer.msg("必填项为空，请检查")
                                    return
                                }
                                $.post('/storage/addSupplies', {productCode:add_productCode,productName:add_productName,expectNum:add_expectNum,overfillNum:add_overfillNum},function(data){
                                    if(data.code=="suss"){
                                        layer.closeAll();
                                        layer.msg("添加成功")
                                        table.reload('suppliesList', {
                                            url: '/storage/getGoodsList'
                                        });
                                        fromClear()
                                    }else if (data.code=="1060"){
                                        layer.msg("添加失败，物料编号重复", {
                                            icon: 2,
                                            time: 2000 //2秒关闭（如果不配置，默认是3秒）
                                        });
                                    }else {
                                        layer.msg("添加失败，请联系管理员", {
                                            icon: 2,
                                            time: 2000 //2秒关闭（如果不配置，默认是3秒）
                                        });
                                    }
                                },'json');
                            })
                        },
                        btn2:function(index,layero){
                            fromClear();
                        }
                    });
                    break;
                case "outExcel":
                    let toolName=$("#toolName").val();
                    let model=$("#model").val();
                    let location=$("#location").val();
                    let userName=$("#userName").val();
                    let status=$("#status").val();
                    window.open("/storage/outSuppliesExcel?toolName="+toolName+"&model="+model+"&location="+location+"&userName="+userName+"&status="+status+"","_blank");
                    break;
            };
        });
        table.on('tool(suppliesList)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
            var data2 = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            let ids = data2.id;
            if(layEvent === 'edit'){
                form.val("formTest1", { //formTest 即 class="layui-form" 所在元素属性 lay-filter="" 对应的值
                    "edit_productCode": data2.productCode // "name": "value"
                    ,"edit_productName": data2.productName // "name": "value"
                    ,"edit_expectNum":data2.expectNum
                    ,"edit_overfillNum": data2.overfillNum
                });
                layer.open({
                    id:'aa',
                    type: 1,
                    title:'修改商品',
                    area: ['600px', '610px'], //自定义文本域宽高
                    content: $('#editSuppliesModel'),
                    btn: ['提交', '取消'],//这里content是一个普通的String
                    success: function(layero, index){
                        layerIndex = index;
                        layero.addClass('layui-form');
                        // 将保存按钮改变成提交按钮
                        layero.find('.layui-layer-btn0').attr({
                            'lay-filter': 'testttt',
                            'lay-submit': ''
                        });
                        form.render();
                    },
                    yes:function(index,layero){
                        let edit_productName=$("#edit_productName").val()//卡号
                        let edit_expectNum=$("#edit_expectNum").val()//角色
                        let edit_overfillNum=$("#edit_overfillNum").val()//权限
                        form.on('submit(testttt)',function(data){
                            $.post('/storage/editSupplies',
                                {id:ids,productName:edit_productName,expectNum:edit_expectNum,overfillNum:edit_overfillNum},function(data){
                                    if(data.code=="suss"){
                                        layer.closeAll();
                                        layer.msg("修改成功")
                                        table.reload('suppliesList', {
                                            url: '/storage/getGoodsList'
                                        });
                                    }else{
                                        layer.msg("修改失败，请联系管理员", {
                                            icon: 2,
                                        });
                                    }
                                },'json');
                        })
                        layer.close(layerIndex);
                        return false;
                    },
                    btn2:function(index,layero){
                        layer.close(index);
                    }
                });
            }
            else if (layEvent === 'del'){
                layer.confirm('确定删除选中的物料吗？', function(index){
                    console.log(ids)
                    $.post('/storage/DelSupplies',{id:ids},function(data){
                        if(data.code=="suss"){
                            layer.close(index);
                            layer.msg("删除成功")
                            table.reload('suppliesList', {
                                url: '/storage/getGoodsList'
                            });
                        }else{
                            layer.msg("删除失败，请联系管理员", {
                                icon: 2,
                                time: 2000 //2秒关闭（如果不配置，默认是3秒）
                            });
                        }

                    },'json');
                    layer.close(index);
                });
            }
        });
        util.event('lay-active', {
            reload:function(res){
                location.reload();
            },
            AllData:function(){
                let toolName=$("#toolName").val();
                let model=$("#model").val();
                let location=$("#location").val();
                let userName=$("#userName").val();
                let status=$("#status").val();
                if(toolName=='' && model=='' && location=='' && userName==''  && status==''){
                    layer.msg("当前无筛选条件")
                }else{
                    table.reload('suppliesList', {
                        url: '/log/SearchtoolReceiveLogList'
                        ,where: {
                            toolName:toolName,
                            model:model,
                            location:location,
                            userName:userName,
                            status:status,
                        } //设定异步数据接口的额外参数
                    });
                }

            },
        })

    })
    function fromClear(){
        $("#add_username").val("")//用户名
        $("#add_cardNo").val("")//卡号
        $("#add_role").val("")//角色
        $("#add_authority").val("")//权限
        $("#add_dept").val("")//部门
        $("#add_team").val("")//班组
        $("#add_company").val("")//公司;

    }
</script>
</body>
</html>
